﻿@using System.Web.Optimization
@using BootstrapSupport
@using NavigationRoutes

 <link href="@Styles.Url("~/Content/widgets.css")" rel="stylesheet" type="text/css" />
               <link href="@Styles.Url("~/Content/template.css")" rel="stylesheet" type="text/css" />
               <link href="@Styles.Url("~/Content/colour.css")" rel="stylesheet" type="text/css" />
               <link href="@Styles.Url("~/Content/960.css")" rel="stylesheet" type="text/css" />
  <link href="@Styles.Url("~/Content/glDatePicker.flatwhite.css")" rel="stylesheet" type="text/css" />
         <link href="@Styles.Url("~/Content/glDatePicker.default.css")" rel="stylesheet" type="text/css" />
           <link href="@Styles.Url("~/Content/glDatePicker.darkneon.css")" rel="stylesheet" type="text/css" />
<script>
    var e = new Array();
    var d = new Date();
    function titi() {
        var day; var month; var year = 0;
        $.ajax({
            //    Reservations accordees
            url: '/Cabinet/GetReservMedecinAccordees',//ça marche
            async: false,
            type: 'POST',
            dataType: 'json',

            success: function (data) {

                for (var i in data) {
                    // d = new Date(parseInt(data[i].DateFin.replace("/Date(", "").replace(")/", ""), 10));

                    // day=d.getDate();
                    day = 2;
                    var k = data[i].DateDebut;

                    // month = (new Date(parseInt(data[i].DateFin.replace("/Date(", "").replace(")/", ""), 20)).getMonth() + 1);
                    // month = d.getMonth();

                    // alert(new Date(parseInt(data[i].DateFin.replace("/Date(", "").replace(")/", ""), 6)));
                    //  year = new Date(parseInt(data[i].DateFin.replace("/Date(", "").replace(")/", ""), 10)).getFullYear();
                    // alert(k[1].split(","));
                    var y = 1;
                    // alert(typeof y);
                    var t = new Date(2013, 0, 2);

                    //alert(t);
                    e.push({ "date": t });
                    //alert("for");
                }

                //alert("------- for");
            }

        });

    }
    window.onload = titi();
    $(document).ready(function () {

        //var j = new Date(2013, 0, 9);

        // e.push({ "date": j });

        // alert("rrrr");
        $('#example3').glDatePicker(
        {
            showAlways: true,
            cssName: 'default',
            //selectedDate: new Date(2013, 0, 5),
            //   specialDates: e
            specialDates: [
                   { date: new Date(2013, 4, 22) },
                   { date: new Date(2013, 4, 26) },
                    { date: new Date(2013, 4, 25) },
                    { date: new Date(2013, 4, 27) },
                    { date: new Date(2013, 5, 15) },
            ]

        });
        // Example #1 - Basic calendar
        $('#example1').glDatePicker(
        {
            showAlways: true
        });

        // Example #2 - Selectable dates and ranges and prevent month/year selection
        $('#example2').glDatePicker(
        {
            showAlways: true,
            allowMonthSelect: false,
            allowYearSelect: false,
            prevArrow: '',
            nextArrow: '',
            selectedDate: new Date(2013, 8, 5),
            selectableDateRange: [
                { from: new Date(2013, 8, 1), to: new Date(2013, 8, 10) },
                { from: new Date(2013, 8, 19), to: new Date(2013, 8, 22) },
            ],
            selectableDates: [
                { date: new Date(2013, 8, 24) },
                { date: new Date(2013, 8, 30) },

            ]
        });

        // Example #3 - Custom style, repeating special dates and callback

        // Example #4 - Day of week offset and restricting date selections
        $('#example4').glDatePicker(
        {
            showAlways: true,
            selectedDate: new Date(2013, 8, 5),
            dowOffset: 3,
            selectableYears: [2012, 2013, 2014],
            selectableMonths: [8, 11],
            selectableDOW: [1, 4, 6]
        });

        // Example #5 - Interactive demo
        var example5 = $('#example5').glDatePicker(
        {
            showAlways: true
        }).glDatePicker(true);

        $('#example5-showAlways').change(function () {
            var showAlways = eval($(this).val());
            example5.options.showAlways = showAlways;

            if (!showAlways) {
                example5.hide();
            }
            else {
                example5.show();
            }
        });

        $('#example5-cssName').change(function () {
            example5.options.cssName = $(this).val();
            example5.render();
        });

        $('#example5-selectableDOW').change(function () {
            example5.options.selectableDOW = eval($(this).val());
            example5.render();
        });

        $('#example5-dowOffset').change(function () {
            example5.options.dowOffset = eval($(this).val());
            example5.render();
        });

        $('#example5-dowNames').change(function () {
            example5.options.dowNames = eval($(this).val());
            example5.render();
        });

        $('#example5-monthNames').change(function () {
            example5.options.monthNames = eval($(this).val());
            example5.render();
        });
    });

</script>
<div class="container" style="font-size:18px;font-family:'Times New Roman'">
    <div style="padding:30px"> Ici vous pouvez consulter les dates des interventions prévues et avoir une vue générale sur les accréditations et les réservations. </div>
<table>
    <tr><td> <br /></td> </tr>
    <tr>
       @* <td  style="width:1700px; height:300px;vertical-align:middle">

            <div  style="padding-top:40px;padding-left:30px">
       
                </div>
        </td>*@<td style="vertical-align:top;padding-left:30px;width:500px; height:300px;">
     <input type="button" style="width:400px; background: url(Content/images/box-h2.png) repeat-x bottom center #fff;text-decoration:solid" value="Votre Calendrier" id="example3" gldp-id="example3" />
    <div gldp-el="example3"
         style="width:400px; height:300px; position:absolute;top:2000px;left:5000px">
    </div>
            <br />   <br />
            <br />
            <br />
            <br/><br /> <br /><br /><br/><br />
            <br />  <br/><br /> <br /><br /><br/><br />
            <br/>
            <div style="width:430px; height:300px;vertical-align:bottom"> <br /><b style="color:#0c0">Couleur verte </b>: date d'une intervention prévue. <br /><b style="color:#c00">Couleur orange</b> : Aujourd'hui.<br />
                <br />Pour consultez le détail des interventions prévues: Choisissez une date et cliquez-dessus.
            </div>

           <td style="width:450px; height:300px;">
       	
				<div class="grid_8" style="font-family:'Times New Roman';">
					<div class="box" style="width:400px; height:300px;">
						<h2>Accréditations</h2>
						<div class="utils">
							<a href="#">Détails</a>
						</div>
						<table style="font-family:'Times New Roman';font-size:16px;">
							<tbody>
                                <tr>
                                   <td><br />&nbsp;&nbsp;<b>Nombre d'accréditations:</b><br /><br /></td> 
                                </tr>
								<tr>
									<td style="color:darkblue;text-decoration:solid">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<b>Confirmées</b><br /><br /></td>
									<td><b>2</b><br /><br /></td>
								</tr>
								<tr>
									<td style="color:darkblue;text-decoration:solid">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<b>En cours</b><br /><br /></td>
									<td><b>1</b><br /><br /></td>
								</tr>
								<tr>
									<td  style="color:darkblue;text-decoration:solid">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<b>Refusées</b><br /><br /></td>
									<td><b>0</b><br /><br /> </td>
								</tr>

								<tr>
									<td ><br />&nbsp;&nbsp;<b>Dernière accréditation accordée:</b> </td>
									<td><br /> 07/04/2013 </td>
								</tr>
							</tbody>
						</table>
					</div>
					
				</div>
             
           
				<div class="grid_8" style="font-family:'Times New Roman';">
					<div class="box" style="width:400px; height:300px;">
						<h2>Réservations</h2>
						<div class="utils">
							<a href="#">Détails</a>
						</div>
						<table style="font-family:'Times New Roman';font-size:16px;">
							<tbody>
                                <tr><td><br />&nbsp;&nbsp;<b>Nombre de réservations:</b><br /><br /></td></tr>
								<tr>
									<td style="color:darkblue;text-decoration:solid">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<b>Confirmées</b><br /><br /></td>
									<td><b>10 </b><br /><br /></td>
								</tr>
								<tr>
									<td style="color:darkblue;text-decoration:solid">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<b>En cours</b><br /><br /></td>
									<td><b>4 </b> <br /><br /></td>
								</tr>
								<tr>
									<td style="color:darkblue;text-decoration:solid">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<b>Refusées</b><br /><br /></td>
									<td><b>2 </b> <br /><br /></td>
								</tr>

								<tr>
									<td><br />&nbsp;&nbsp;<b>Date prochaine intervention:</b></td>
									<td><br /> 22/05/2013 </td>
                                 
								</tr>
							</tbody>
						</table>
					</div>
					
				</div>
       
		
        </td>





        </td>
    </tr>
    <tr> <td><br /><br /></td></tr>
    <tr><td><br /><br /></td></tr>
    <tr><td><br /><br /></td></tr>
    </table>
@* <div id="content" class="container_16 clearfix" >
           
<table>     
    <tr>
      
        <td>
       
			
				<div class="grid_8" style="font-family:'Times New Roman';margin-right:30px;margin-left:30px">
					<div class="box">
						<h2>Accréditations</h2>
						<div class="utils">
							<a href="#">Détails</a>
						</div>
						<table style="font-family:'Times New Roman';font-size:16px;">
							<tbody>
                                <tr>
                                   <td><br />&nbsp;&nbsp;Nombre d'accréditations:<br /><br /></td> 
                                </tr>
								<tr>
									<td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Confirmées<br /><br /></td>
									<td>3<br /><br /></td>
								</tr>
								<tr>
									<td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;En cours<br /><br /></td>
									<td>2<br /><br /></td>
								</tr>
								<tr>
									<td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Refusées<br /><br /></td>
									<td>0<br /><br /> </td>
								</tr>

								<tr>
									<td><br />&nbsp;&nbsp;Dernière accréditation accordée: <br /><br /></td>
									<td><br /> 09/05/2013 <br /><br /></td>
								</tr>
							</tbody>
						</table>
					</div>
					
				</div>
             
           
				<div class="grid_8" style="font-family:'Times New Roman';margin-right:30px;margin-left:40px">
					<div class="box">
						<h2>Réservations</h2>
						<div class="utils">
							<a href="#">Détails</a>
						</div>
						<table style="font-family:'Times New Roman';font-size:16px;">
							<tbody>
                                <tr><td><br />&nbsp;&nbsp;Nombre de réservations:<br /><br /></td></tr>
								<tr>
									<td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Confirmées<br /><br /></td>
									<td>3<br /><br /></td>
								</tr>
								<tr>
									<td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;En cours<br /><br /></td>
									<td>2 <br /><br /></td>
								</tr>
								<tr>
									<td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Refusées<br /><br /></td>
									<td>0 <br /><br /></td>
								</tr>

								<tr>
									<td><br />&nbsp;&nbsp;Date prochaine intervention:<br /><br /></td>
									<td><br /> 30/05/2013 <br /><br /></td>
                                 
								</tr>
							</tbody>
						</table>
					</div>
					
				</div>
       
		
        </td></tr>
    </table>
     	</div>*@
    </div>